<script type="text/javascript">
    //封装下上传组件
    function webupload(list,filePicker_image,image_preview,image,more,upload_allowext){
        if(upload_allowext){
            upload_allowext = upload_allowext.replace('|',',');
        }
        var $list=$("#"+list+"");   //这几个初始化全局的百度文档上没说明，好蛋疼
        var uploader = WebUploader.create({
            auto: true,// 选完文件后，是否自动上传。
            swf: '/static/plugins/webuploader-0.1.5/uploader.swf', //加载swf文件，路径一定要对
            server: '{:url("index/upload")}',// 文件接收服务端
            pick: '#'+filePicker_image,// 选择文件的按钮。可选。
            resize: false,//不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
            compress: false,
            fileSingleSizeLimit: 200*1024*1024,//限制大小200M，单文件
            //fileSizeLimit: allMaxSize*1024*1024,//限制大小10M，所有被选文件，超出选择不上
            accept: {
                title: '上传图片/文件',
                extensions: upload_allowext,//'gif,jpg,jpeg,bmp,png', //格式由字段控制
                mimeTypes: '*',//默认全部文件，为兼容上传文件功能，如只上传图片可写成img/*
            }
        });

        // 文件上传过程中创建进度条实时显示。
        uploader.on( 'uploadProgress', function( file, percentage ) {
            var $li = $list,
                    $percent = $li.find('.progress .progress-bar');
            // 避免重复创建
            if ( !$percent.length ) {
                $percent = $('<div class="progress progress-striped active">' +
                        '<div class="progress-bar" role="progressbar" style="width: 0%">' +
                        '</div>' +
                        '</div>').appendTo( $li ).find('.progress-bar');
            }
            //$li.find('p.state').text('上传中');
            $percent.css( 'width', percentage * 100 + '%' );
        });
        uploader.on( 'uploadSuccess', function( file,response) {
            var url = response._raw;
            if(more==true){
                var images='<div class="row"><div class="col-xs-6"><input type="text" name="'+image+'[]" value="'+url+'" class="form-control"/></div> <div class="col-xs-3"><input class="form-control input-sm" type="text" name="'+image+'_title[]" value="'+file.name+'" ></div> <div class="col-xs-3"><button type="button" class="btn btn-block btn-warning remove_images">移除</button></div></div>';
                var images_list= $('#more_images_'+image).html();

                $('#more_images_'+image).html(images+images_list);

            }else{
                $("input[name='"+image+"']").val(url);
                $("#"+image_preview).attr('src',url);
            }
        });
        uploader.on( 'uploadComplete', function( file ) {
            $list.find('.progress').fadeOut();
        });
        //错误提示
        uploader.on("error", function (type) {
            if (type == "Q_TYPE_DENIED") {
                sweetAlert(
                        '',
                        '请上传'+upload_allowext+'格式文件！',
                        'error'
                )
            } else if (type == "F_EXCEED_SIZE") {
                sweetAlert(
                        '',
                        '单个文件大小不能超过20M！',
                        'error'
                )
            }else if (type == "F_DUPLICATE") {
                sweetAlert(
                        '',
                        '请不要重复选择文件！',
                        'error'
                )
            }else {
                sweetAlert(
                        '',
                        '上传出错！请检查后重新上传！错误代码'+type,
                        'error'
                )
            }
        });
    }
</script>